<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表白吧</title>
    <link rel="icon" href="./favicon.png">
    <link rel="stylesheet" href="./index.css">
  </head>
  <body data-theme="pink">
    <div class="not-support">当前设备不支持！</div>
    <div class="layout">
      <div class="header">
        <div class="app-name">
          <svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24">
            <path fill="#F56C6C" d="M739.584 70.592c-92.224 0-177.792 63.04-228.224 109.568C460.864 133.632 375.36 70.592 283.008 70.592 108.48 70.592 0 176.96 0 348.16 0 492.8 130.688 608.256 131.2 608.64l340.544 328.512c10.432 10.432 24.448 16.256 39.552 16.256s29.056-5.824 39.296-16l341.248-328.64c30.656-29.376 130.752-134.848 130.752-260.544C1022.656 176.96 914.176 70.592 739.584 70.592z"></path>
          </svg>
          <span>表白吧</span>
        </div>
        <div class="theme" onclick="changeTheme(event)">
          <div class="theme-item" title="粉色" style="background: #edbbcf;"></div>
          <div class="theme-item" title="红色" style="background: #d00a0a;"></div>
        </div>
      </div>
      <div class="main">
        <div class="love-time-wrap">
          <div class="love-declaration">
            <h4>亲爱的XXX！</h4>
            <p>你知道吗？在2020年5月15日晚上，我做了一个很奇怪的梦，有一个人跟我说了一句话，他告诉我说会让我爱她一生的那个人要来了。</p>
            <p>很幸运的是我第二天就认识了一个女孩，她说话的声音很好听，让我感觉到很亲切，就好像前世恋人重逢了一样。</p>
            <p>第二天中午你主动跟我打了一招呼，我当时心里瞬间明白了前一天那个人跟我说的那个女孩了，那个女孩就是你啊！</p>
            <p>在接下来的一个多月里，我们聊了很多很多，让我们的距离越来越近，但是我一直没有想你表白，因为我在等一个合适的机会。</p>
            <p>现在，农历2020年5月20日20时13分14秒，这是不错的时刻！</p>
            <p>遇到你，是缘分；喜欢你，是命中注定；爱上你，是我情非得已；想念你，是我逼不得已。XXX，请让我用我的余生去爱你吧!</p>
          </div>
          <div class="love-time">
            XXX，这是二货程序员爱你的 <span class="br"></span><span id="day"></span> 天 <span id="hour"></span> 小时 <span id="minute"></span> 分 <span id="second"></span> 秒！
          </div>
          <div class="love-tree">
            <img src="./love-tree.png" />
          </div>
        </div>
      </div>
    </div>
    <script src="./index.js"></script>
  </body>
</html>